From: Florian Müllner <fmuellner@gnome.org>
Date: Thu, 13 Dec 2018 16:44:28 +0000 (+0100)
Subject: dateMenu: Refresh world clocks section
X-Git-Tag: archive/raspbian/50.5-1+rpi1~1^2~897^2^2~37
X-Git-Url: https://dgit.raspbian.org/%22http://www.example.com/cgi/%22/%22http:/www.example.com/cgi/%22?a=commitdiff_plain;h=40e624444cc352a90ad43af2e1fdf50b85d379b9;p=gnome-shell.git

dateMenu: Refresh world clocks section

Update the section styling to accentuate the most relevant information,
and include the timezone.

https://gitlab.gnome.org/GNOME/gnome-shell/issues/262
---

diff --git a/data/theme/gnome-shell-sass/_common.scss b/data/theme/gnome-shell-sass/_common.scss
index d952f1427..693ecb3de 100644
--- a/data/theme/gnome-shell-sass/_common.scss
+++ b/data/theme/gnome-shell-sass/_common.scss
@@ -930,14 +930,28 @@ StScrollBar {
     .world-clocks-grid,
     .weather-grid {
       spacing-rows: 0.4em;
+      spacing-columns: 0.8em;
     }
 
     .weather-box {
       spacing: 0.4em;
     }
 
-    .weather-grid {
-      spacing-columns: 0.8em;
+    .world-clocks-city {
+      font-weight: bold;
+      font-size: 0.9em;
+    }
+
+    .world-clocks-time {
+      color: darken($fg_color,20%);
+      font-feature-settings: "tnum";
+      font-size: 1.2em;
+    }
+
+    .world-clocks-timezone {
+      color: darken($fg_color,40%);
+      font-feature-settings: "tnum";
+      font-size: 0.9em;
     }
 
     .weather-forecast-icon {
diff --git a/js/ui/dateMenu.js b/js/ui/dateMenu.js
index 0a6f267e7..8f961d7f3 100644
--- a/js/ui/dateMenu.js
+++ b/js/ui/dateMenu.js
@@ -156,18 +156,27 @@ var WorldClocksSection = class WorldClocksSection {
             let label = new St.Label({ style_class: 'world-clocks-city',
                                        text: name,
                                        x_align: Clutter.ActorAlign.START,
+                                       y_align: Clutter.ActorAlign.CENTER,
                                        x_expand: true });
 
-            let time = new St.Label({ style_class: 'world-clocks-time',
-                                      x_align: Clutter.ActorAlign.END,
-                                      x_expand: true });
+            let time = new St.Label({ style_class: 'world-clocks-time' });
+
+            let offset = l.get_timezone().get_offset() / 60.;
+            let fmt = (Math.trunc(offset) == offset) ? '%s%.0f' : '%s%.1f';
+            let prefix = (offset >= 0) ? '+' : '-';
+            let tz = new St.Label({ style_class: 'world-clocks-timezone',
+                                    text: fmt.format(prefix, Math.abs(offset)),
+                                    x_align: Clutter.ActorAlign.END,
+                                    y_align: Clutter.ActorAlign.CENTER });
 
             if (this._grid.text_direction == Clutter.TextDirection.RTL) {
-                layout.attach(time, 0, i + 1, 1, 1);
-                layout.attach(label, 1, i + 1, 1, 1);
+                layout.attach(tz, 0, i + 1, 1, 1);
+                layout.attach(time, 1, i + 1, 1, 1);
+                layout.attach(label, 2, i + 1, 1, 1);
             } else {
                 layout.attach(label, 0, i + 1, 1, 1);
                 layout.attach(time, 1, i + 1, 1, 1);
+                layout.attach(tz, 2, i + 1, 1, 1);
             }
 
             this._locations[i].actor = time;